<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>首页头</title>
    <link href="/before/css/common.css" rel="stylesheet" tyle="text/css"/>
    <link href="/before/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="/before/fonts/iconfont.css" rel="stylesheet" type="text/css"/>
    <script src="/before/js/lrtk.js" type="text/javascript"></script>
    <script src="/before/js/jquery.min.1.8.2.js" type="text/javascript"></script>
    <script src="/before/js/jquery.SuperSlide.2.1.1.js" type="text/javascript"></script>
    <script src="/before/js/common_js.js" type="text/javascript"></script>
    <script src="/before/js/footer.js" type="text/javascript"></script>
    <script src="/before/js/jquery.jumpto.js" type="text/javascript"></script>
    <script src="/after/js/layer/layer.js" charset="utf-8"></script>
    <script src="/after/js/vue/vue.min.js" type="text/javascript"></script>
</head>
<style type="text/css">
    .clearfix li a:visited {
        color: #0000FF; /*连接访问的颜色变化*/
    }

    .clearfix li a:hover {
        color: #00FF00; /*鼠标经过的颜色变化*/
    }

    .clearfix li a:active {
        color: #FFFF00; /*鼠标按下的颜色变化*/
    }
    #suggest {
        position: absolute;
        z-index: 9999;
        width: 495px;
        font-size: 15px;
        background-color: #FFFFFF   ;
    }
</style>
<body>
<!--顶部样式-->
<div id="header_top">
    <div id="top">
        <div class="Inside_pages">
            <div class="Collection">欢迎光临叮叮商城！<em></em></div>
            <div class="hd_top_manu clearfix">
                <ul class="clearfix">
                <#if Session.NowCustom?exists>
                    <li class="hd_menu_tit zhuce" data-addclass="hd_menu_hover">尊敬的:<span class="red">${NowCustom.name}</span>欢迎您!!!<a href="/stageregist/outLogin.do">注销登录</a></li>

                <#else >
                    <li class="hd_menu_tit zhuce" data-addclass="hd_menu_hover">欢迎光临本店！<a
                            href="/stageregist/toLogin.do" class="red">[请登录]</a>>
                        新用户<a href="/stageregist/toRegist.do" class="red">[免费注册]</a></li>

                </#if>
                    <li class="hd_menu_tit" data-addclass="hd_menu_hover"><a href="/stage/LLpersonal.html" onclick="return myclick()">个人中心</a></li>
                    <li class="hd_menu_tit" data-addclass="hd_menu_hover"><a href="/shop/toShop.do" onclick="return myclick()">购物车</a></li>

                    <li class="hd_menu_tit phone_c" data-addclass="hd_menu_hover"><a href="javascript:;"
                                                                                     class="hd_menu "><em
                            class="iconfont icon-phone"></em>手机版</a>
                        <div class="hd_menu_list erweima">
                            <ul>
                                <img src="/before/images/erweima.png" width="100px" height="100"/>
                            </ul>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!--样式-->
    <!--顶部样式2-->
    <div id="header " class="header page_style">
        <div class="logo"><a href="/stageregist/toIndex.do"><img src="/before/images/logo1.png"/></a></div>
        <!--可修改图层-->
        <div class="festival"><a href="javascript:;"><img src="/before/images/logo_gou.png"/></a></div>
        <!--结束图层-->
        <div class="Search">
            <p>
                <input id="keyword" name="keyword" type="text" class="text"/>
                <input name="" type="submit" value="搜 索" class="Search_btn"/>
            </p>
            <div id="suggest"></div>
        </div>
    </div>

    <!--菜单导航样式-->
    <div id="Menu" class="clearfix">
        <div class="Inside_pages">
            <div id="allSortOuterbox" class="display">
                <div class="t_menu_img"></div>
                <div class="Category"><a href="javascript:;"><em></em>所有产品分类</a></div>
                <div class="hd_allsort_out_box_new" style="height: auto">
                    <!--左侧栏目开始-->
                    <ul class="Menu_list">
                    <#list btypelist as bbtype>
                        <li class="name">
                            <div class="Menu_name" style="height: 40px">
                                <a href="/pc/chaunzhi.do?btypeId=${bbtype.id}" style="font-size: 20px">${bbtype.type}</a>
                                <span>&lt;</span></div>

                            <div class="menv_Detail" style="width: 600px;height: 100%">
                                <div class="cat_pannel clearfix" style="font-size: 16px">

                                    <#list stypelist as stype>
                                        <#if stype.btype.id=bbtype.id>
                                            <a href="/pc/cz.do?stypeId=${stype.id}" style="font-size: 16px;">${stype.type}</a>|
                                        </#if>
                                    </#list>

                                </div>
                            </div>

                        </li>
                    </#list>

                    </ul>
                </div>
            </div>

            <!--菜单栏-->
            <div class="Navigation" id="Navigation">
                <ul class="Navigation_name">
                    <li><a href="/stage/index.ftl">首页</a></li>
                    <li><a href="/stage/LLpersonal.html" onclick="return myclick()">个人中心</a></li>
                    <li><a href="javascript:;" onclick="showTalk()">联系我们</a></li>
                    <li><a href="/stage/LJGroup_by.ftl">免费预览</a></li>
                    <li><a href="/shop/toShop.do" onclick="return myclick()">购物车</a></li>
                </ul>
            </div>
            <script>$("#Navigation").slide({titCell: ".Navigation_name li"});</script>
        </div>
    </div>
</div>

</body>
</html>

<script>
    //选择需要先登录
    function myclick() {
        if("${NowCustom}"=="" || "${NowCustom}"==null) {
            alert("未登录,请先登录！");
            return false;
        }
        return true;
    }

    //搜索自动补全
    $(function () {
        $("#keyword").keyup(function () {
            if ($("#keyword").val() != "") {
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: "/chaxun/getBookByKeyword2.do",
                    data: {
                        keyword: $("#keyword").val()
                    },
                    success: function (msg) {
                        callback2(msg.getKeyword);
                    }
                })
            } else {
                $("#suggest").html("");
            }
        });
    });

    function callback(data) {//回调函数
        var sobj = $("#suggest");
        sobj.innerHTML = "";
        var suggest = "";
        var str = data.split(",");
        if (str.length > 0 && str[0].length > 0) {
            for (i = 0; i < str.length; i++) {
                suggest += "<div onmouseover='suggestOver(this);'";
                suggest += " onmouseout='suggestOut(this);'";
                suggest += " onclick='setSearch(this.innerHTML);'";
                suggest += " class='suggest_link'>" + str[i] + "</div>";
            }
            sobj.html(suggest).css("display", "block");
        }
    }


    function callback2(data) {
        var list = data;
        var suggest = "";
        for (i = 0; i < list.length; i++) {
            suggest += "<div onmouseover='suggestOver(this);'";
            suggest += " onmouseout='suggestOut(this);'";
            suggest += " class=suggest_link><a href='/stage/LQ_details.ftl?id=" + list[i].id + "' onclick='setSearch(this.innerHTML);'>" + list[i].name + "</a></div>";
        }
        $("#suggest").html(suggest).css("display", "block");
    }

    function suggestOver(o) {
        o.style.background = "lightblue";
    }

    function suggestOut(o) {
        o.style.background = "#FFFFFF";
    }

    function setSearch(o) {
        $("#keyword").val(o);
        $("#suggest").html("");
    }
</script>